import * as React from "react";
import { Provider } from "react-redux";
import Store from "../store";
import Styled from "./App.scss";
import Screen from "./Screen";
import JoyPad from "./JoyPad";
export interface IAppProps {
    [x: string]: any;
}

export default class App extends React.Component<IAppProps, any> {
    public render() {
        return (
            <Provider store={Store}>
                <div className={Styled.app}>
                    <div className={Styled.top}>
                        <h3>Tetris</h3>
                    </div>
                    <div className={Styled.middle}>
                        <div className={Styled.left} />
                        <div className={Styled.main}>
                            <Screen ccsName={Styled.screen} />
                            <div className={Styled.states} />
                        </div>
                        <div className={Styled.right} />
                    </div>
                    <div className={Styled.bottom}>
                        <JoyPad />
                    </div>
                </div>
            </Provider>
        );
    }
}
